﻿@model iemtm.WeChat.Core.WXEditor
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>重要通知--@Model.EditorTitle</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <script src="~/Content/script/jquery-3.3.1.min.js"></script>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        html, body {
            position: relative;
            height: 100%;
            color: #333;
            line-height: 1.6;
            max-width: 677px;
            margin-left: auto;
            margin-right: auto;
        }

        body {
            padding: 20px 16px 12px;
            background-color: #fff;
            letter-spacing: 0.034em;
        }

        li, a {
            list-style: none;
            text-decoration: none;
        }

        #header .rich_media_title {
            font-size: 0.75rem;
            line-height: 1.4;
            margin-bottom: 14px;
            word-wrap: break-word;
            font-weight: 400;
        }

        #header .rich_media_meta_list {
            margin-bottom: 22px;
            line-height: 0.7rem;
            font-size: 0;
            word-wrap: break-word;
            word-break: break-all;
        }

        #header .rich_media_meta {
            display: inline-block;
            vertical-align: middle;
            margin: 0 10px 10px 0;
            font-size: 0.5rem;
            -webkit-tap-highlight-color: rgba(0,0,0,0);
        }

            #header .rich_media_meta a {
                color: #576b95;
                text-decoration: none;
                -webkit-tap-highlight-color: rgba(0,0,0,0);
            }

        #header .rich_media_meta_text {
            color: rgba(0,0,0,0.3);
            font-style: normal;
        }

        #content {
            overflow: hidden;
            color: #333;
            font-size: 0.6rem;
            word-wrap: break-word;
            -webkit-hyphens: auto;
            -ms-hyphens: auto;
            hyphens: auto;
            text-align: justify;
        }

            #content p {
                text-align: center;
                line-height: 1.2rem;
            }

                #content p img {
                    width: 100% !important;
                    height: auto !important;
                    visibility: visible !important;
                }

                #content p span {
                    color: rgb(89, 89, 89);
                    font-size: 0.55rem;
                    letter-spacing: 0.5px;
                }

                    #content p span.strong span {
                        font-size: 0.55rem;
                        letter-spacing: 0.5px;
                        color: rgb(187, 2, 2);
                    }
    </style>
</head>
<body>
    <div id="header">
        <h2 class="rich_media_title">@Model.EditorTitle</h2>
        <div class="rich_media_meta_list">
            <span class="rich_media_meta">
                <a href="javascript:void(0);" id="js_name">@Model.CreateName</a>
            </span>
            <em class="rich_media_meta rich_media_meta_text">@Model.CreateTime.Value.ToString("yy-MM-dd HH:mm:ss")</em>
        </div>
    </div>
    <div id="content">
        @Html.Raw(@Model.EditorTxt)
    </div>
    <script>
      (function(designWidth, maxWidth) {
          var html = document.getElementsByTagName("html")[0];
          var tid;
          function refreshRem() {
            var width = html.getBoundingClientRect().width;
            console.log(width / 15)
            html.style.fontSize = width / 15 + "px"
          }
          window.addEventListener("resize", function() {
            clearTimeout(tid); //防止执行两次
            tid = setTimeout(refreshRem, 300);
          }, false);
          refreshRem();
      })();
    </script>
</body>
</html>

